<template>
    <a href="/">信息添加</a>
    <h2>信息显示</h2>
    <a href="/login">登录</a>
    房型
    <select v-model="query.fxx">
                        <option value="0">请选择</option>
                        <option value="1">双人床</option>
                        <option value="2">总统套房</option>
                    </select>

    房号
    <select v-model="query.fhh">
                        <option value="0">请选择</option>
                        <option value="1">1001</option>
                        <option value="2">1002</option>
                    </select>
    <input type="button" value="查询" @click="querys">
    <table class="table">
        <thead>
            <tr>
                <th>编号</th>
                <th>房间名称</th>
                <th>房型</th>
                <th>房号</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody v-for="a in data">
            <tr>
                <th>{{a.hid}}</th>
                <th>{{a.hame}}</th>
                <th>{{a.fx?"双人床":"总统套房"}}</th>
                <th>{{a.fh?"1001":"1002"}}</th>
                <th>
                    <input type="button" value="信息修改" @click="updatt(a.hid)">
                </th>
            </tr>
        </tbody>
    </table>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
const router=useRouter()

const query=ref({
    fhh:0,
    fxx:0
})

const querys=()=>{
    shoow()
}


//修改

const updatt=(val:any)=>{
    router.push({path:"/update",query:{id:val}})
}


onMounted(()=>{
    shoow()
})
const data=ref([{
    "hid": 0,
    "hame": "",
    "fx": 0,
    "fh": 0
}])

const shoow=()=>{
    axios.get("https://localhost:7099/api/VS/Show",{params:query.value}).then(res=>{
    data.value=res.data;
    })
}
</script>

<style scoped>

</style>